import 'package:flutter/material.dart';
import 'package:flutter_keyboard_visibility/flutter_keyboard_visibility.dart';
import 'package:get/get.dart';
import 'package:zrjz/comm/base/base.dart';
import 'package:zrjz/comm/constants/constants.dart';
import 'package:zrjz/comm/utils/ex_widget.dart';
import 'package:zrjz/comm/utils/ext_dart.dart';
import 'package:zrjz/comm/utils/log_utils.dart';
import 'package:zrjz/comm/widget/common_widget.dart';
import 'package:zrjz/comm/widget/my_button.dart';
import 'package:zrjz/comm/widget/my_load_image.dart';
import 'package:zrjz/comm/widget/my_text_field.dart';
import 'package:zrjz/generated/assets.dart';
import 'package:zrjz/modules/me/reset_password/reset_password_state.dart';
import 'package:zrjz/router/page_router.dart';

import 'reset_password_controller.dart';

/// 分为设置密码 与 修改密码 两种模式
class ResetPasswordPage extends BaseStatelessPage<ResetPasswordController> {
  ResetPasswordPage({Key? key}) : super(key: key);

  //启动当前页面
  static void startInstance(String? type) {
    return Get.start(RouterPath.RESETPASSWORD, arguments: {'type': type});
  }

  late ResetPasswordState state;

  @override
  ResetPasswordController createRawController() {
    return ResetPasswordController();
  }

  @override
  void initState() {
    state = controller.state;
  }

  @override
  Widget buildWidget(BuildContext context) {
    return autoCtlGetBuilder(builder: (controller) {
      return Scaffold(
          appBar: CommonWidget.appBar(context, controller.isChangedType ? "修改密码".tr : "设置密码".tr),
          body: SafeArea(
            bottom: true,
            top: false,
            child: SizedBox(
              width: double.infinity,
              child: SingleChildScrollView(
                scrollDirection: Axis.vertical,
                physics: const BouncingScrollPhysics(),
                child: Column(
                  mainAxisSize: MainAxisSize.max,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    //旧密码
                    Visibility(
                      visible: controller.isChangedType, // 设置为 false 表示隐藏控件
                      child: _buildInputLayout(
                        "old_password",
                        Assets.authLoginPasswordIcon,
                        leftIconWidth: 13.5,
                        leftIconHeight: 16,
                        marginTop: 20,
                        textInputAction: TextInputAction.next,
                        errorText: controller.oldPasswordErrorText,
                        onSubmit: (formKey, value) {
                          state.formData[formKey]!['focusNode'].unfocus();
                          FocusScope.of(context).requestFocus(state.formData['old_password']!['focusNode']);
                        },
                      ),
                    ),

                    //新密码
                    _buildInputLayout(
                      "password",
                      Assets.authLoginPasswordIcon,
                      leftIconWidth: 13.5,
                      leftIconHeight: 16,
                      marginTop: 10,
                      textInputAction: TextInputAction.next,
                      errorText: controller.passwordErrorText,
                      onSubmit: (formKey, value) {
                        state.formData[formKey]!['focusNode'].unfocus();
                        FocusScope.of(context).requestFocus(state.formData['confirm_password']!['focusNode']);
                      },
                    ),

                    //再次新密码
                    _buildInputLayout(
                      "confirm_password",
                      Assets.authLoginPasswordIcon,
                      leftIconWidth: 13.5,
                      leftIconHeight: 16,
                      marginTop: 10,
                      errorText: controller.confirmPasswordErrorText,
                      onSubmit: (formKey, value) {
                        state.formData[formKey]!['focusNode'].unfocus();
                        controller.doResetPassword();
                      },
                    ),

                    //登录按钮
                    MyButton(
                      text: "提交".tr,
                      textColor: ColorConstants.whitefe,
                      fontSize: 16,
                      fontWeight: FontWeight.w700,
                      backgroundColor: ColorConstants.appBlue,
                      minHeight: 50,
                      radius: 5,
                      onPressed: () => controller.doResetPassword(),
                    ).marginOnly(left: 20, right: 20, top: 28, bottom: 43),
                  ],
                ),
              ),
            ),
          ));
    });
  }

  /// 手机号码与验证码的输入框
  _buildInputLayout(
    String key,
    String leftIconRes, {
    double leftIconWidth = 0,
    double leftIconHeight = 0,
    double marginTop = 23,
    double paddingRight = 18,
    bool? showRightIcon = false, //是否展示右侧的布局
    Widget? rightWidget, //右侧的布局
    TextInputType textInputType = TextInputType.text,
    String? errorText,
    TextInputAction textInputAction = TextInputAction.done,
    Function? onSubmit,
  }) {
    return IgnoreKeyboardDismiss(
      child: MyTextField(
        key,
        state.formData[key]!['value'],
        hintText: state.formData[key]!['hintText'],
        hintStyle: const TextStyle(
          fontSize: 14.0,
          fontWeight: FontWeight.w500,
        ),
        controller: state.formData[key]!['controller'],
        focusNode: state.formData[key]!['focusNode'],
        margin: EdgeInsets.only(left: 20, right: 20, top: marginTop),
        showDivider: false,
        fillBackgroundColor: DarkThemeUtil.multiColors(ColorConstants.white, darkColor: ColorConstants.darkBlackItem),
        fillCornerRadius: 5,
        padding: EdgeInsets.only(left: 16, right: paddingRight, top: 2.5, bottom: 2.5),
        height: 50,
        style: TextStyle(
          color: DarkThemeUtil.multiColors(ColorConstants.tabTextBlack, darkColor: ColorConstants.white),
          fontSize: 14.0,
          fontWeight: FontWeight.w500,
        ),
        inputType: textInputType,
        textInputAction: textInputAction,
        onSubmit: onSubmit,
        cursorColor: ColorConstants.tabTextBlack,
        obscureText: state.formData[key]!['obsecure'],
        errorText: errorText,
        showLeftIcon: true,
        showRightIcon: showRightIcon,
        rightWidget: rightWidget,
        leftWidget: Row(
          children: [
            MyAssetImage(leftIconRes, width: leftIconWidth, height: leftIconHeight),
            const Spacer(),
            Container(
              color: ColorConstants.graye5,
              width: 1,
              height: 15,
            )
          ],
        ).constrained(width: 30),
      ),
    );
  }
}
